<!--红云超市-->
<template>
  <div class="item-content">
    <div class="item-ticket" v-for="(data,index) in goodsList" @click="showDetail(data)" :key="index">
      <img :src="data.pic" alt="">
    </div>
  </div>
</template>

<script>
  import moment from 'moment'
  import tools from '@/utils/tools'

  export default {
    props: ['groupId'],
    name: 'happyShoppingChild',
    data () {
      return {
        currentIndex: '1',
        fn: tools,
        isLoading: true,
        options: {
          pullUpLoad: true,
          scrollbar: false,
        },
        pageIndex: 1,
        swipeData: [],
        goodsList: [],
        childLength: null,
        userInfo: {},
        partyInfo: {},
        sysFile: {},
        todayData: {},

      }
    },
    created () {
      this.userInfo = this.$localStorage.get('userInfo')
      let pInfo = this.$localStorage.get('partyInfo')
      if (pInfo) {
        this.partyInfo = pInfo
      }

      this.mallProductInfoPage();
    },
    methods: {
      //请求商户类型
      mallProductInfoPage() {
        let data = {
          "pageNo": 1,
          "pageSize": 3,
          "pointPriceEnd": "",
          "pointPriceStart": "",
          "publishStatus": 0,
          "saleOrder": "",
          "storeId": this.groupId,
          "verifyStatus": 0
        }
        this.fetchService
        .mallProductInfoPage(data)
        .then((res) => {
          if (res.code == 0) {
              this.goodsList = res.data;
              this.childLength = res.data.length;
              this.$emit('addIsShow', this.childLength > 0 ? true : false);
          }
        });
      },
      //点击查看详情
      showDetail(data) {
        this.$router.push({path: 'mallForRecordDetail'});
        sessionStorage.setItem('commodityInfo',JSON.stringify(data));
      }
    }
  }
</script>

<style scoped lang="scss">
  @import "@/common/stylus/moon.scss";
  .mine-page{
    /* background: url("../../../static/images/dangjian/mine/bg-mine-hd.png") $bg-color no-repeat center #{pxToRem($head-height)};
    background-size: 100% auto; */
    padding:0;
    .header {
      justify-content: space-between;
      margin-bottom: pxToRem(0px);
      position: relative;
      .message {
        .head-btn-text {
          font-size: 14PX;
        }
      }
    }
  }

  .score-hd {
    height:242px;
    text-align: center;
    background: url("../../../../static/images/dangjian/mine/bg-mine-hd.png") $theme-color no-repeat center;
    background-size: 100% auto;
    display: flex;
    justify-content: space-around;
    align-items: center;

    .score-head {
        width: 118px;
        height: 118px;
        border-radius: 50%;
        overflow: hidden;
        border: 4px solid #EA7676;

      img {
        height: 100%;
        width: 100%;
      }
    }

    .score-text {
      margin-right: 50px;
      text-align: left;

      .score-tip {
        .score-tip-text {
          vertical-align: super;
          color: #ffffff;

        }
      }

    }

    .score-play {
      width: 171px;
      height: 46px;
      line-height: 46px;
      background: #E20001;
      border: 1px solid #FFFFFF;
      border-radius: 10px;
      color: #ffffff;
    }

    .score {
      font-size:56PX;
      line-height:1.2em;
      font-weight:400;
      color:rgba(255,255,255,1);
      margin-right: 10px;
    }

    .tip {
      font-size:12PX;
      font-weight:400;
      color:rgba(255,255,255,1);
    }
  }

  .shopping-main {
    padding: 20px;
    .item {
      width: 100%;
      height: 370px;
      box-shadow: 0px 5px 20px 0px rgba(0, 0, 59, 0.1);
      border-radius: 10px;
      margin-bottom: 20px;
      padding: 0 20px;
      background: #ffffff;
      .item-head {
        width: 100%;
        height: 110px;
        font-size: 14PX;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #E5E5E5;
        .item-info {
          font-size: 14PX;
          img {
            display: inline-block;
            width: 70px;
            height: 70px;
            vertical-align: middle;
            margin-right: 24px;
          }
        }

        .right {
          width: 110px;
          height: 40px;
          text-align: center;
          font-size: 12PX;
          line-height: 40px;
          border: 1px solid #EC0C0C;
          color: #EC0C0C;
          border-radius: 10px;
        }
      }
      .item-content {
        width: 100%;
        height: 260px;
        float: left;
        .item-ticket {
          width: 31%;
          height: 204px;
          margin-right: 3%;
          &:last-child {
            margin-right: 0;
          }
          img {
            width: 100%;
            height: 100%;
            background: #f6f6f6;
          }
          p {
            color: #EC0D0D;
            margin-top: 24px;
            margin-bottom: 12px;
            .num {
              font-size: 20PX;
              /* display: block; */
            }
          }

          .tip {
            display: block;
            font-size: 12PX;
            color: #666666;
          }
        }
      }
    }
  }

</style>
